<!DOCTYPE html>
<html>

<head>
    <meta name="viewport" content="user-scalable=0, width=device-width, initial-scale=1, maximum-scale=1">
    <meta id="stopUsePullRefresh"   value="true">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="stylesheet" href="./css/swiper.min.css">
    <link rel="stylesheet" href="./css/animate.css">
    <script src="./js/zepto.min.js"></script>
    <script src="./js/fastclick.min.js"></script>
    <script src="./js/swiper.jquery.min.js"></script>
	<script src="//g.alicdn.com/tmapp/tida2/2.2.15/tida.js?appkey=23164248"></script>
	<script src="//res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script type="text/javascript" src="static/js/interface.js"></script>
	<script type="text/javascript" src="static/js/touch.js"></script>
	<script src="./js/resloader.js"></script>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }
        html,body{
            width: 100%!important;
            height: 100%!important;
            overflow: hidden;

        }
        #avatar-box{
            position: absolute;
            width: 100px;
            height: 100px;
            /*background-color: rgba(255,0,255,0.4);*/
            background-size: 100% auto;
            background-repeat:no-repeat;
            border-radius: 50%;
            -webkit-border-radius: 50%;
            border: 3px solid #F1F6EF;
            box-shadow: 1px 1px 2px #E0E0E0;
        }
#loading {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 99999999;
            background-color: black;
        }

        .wrap, .load-contain, .load-fill {
            width: 180px;
            height: 180px;
            background-size: 180px 180px;
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -90px;
            margin-left: -90px;
        }

        .wrap {
            background: #fff;
            overflow: hidden;
        }

        .load-contain {
            background: url("./img/loading/container.png") no-repeat center center;
            z-index: 2;
        }

        .load-fill {
            width: 116px;
            height: 149px;
            margin-top: 50px;
            margin-left: -58px;
            background: url("./img/loading/pfill.png") no-repeat center center;
            transition: all .5s;
        }

        .progress {
            font-size: 20px;
            color: #ffd125;
            text-align: center;
            width: 100%;
            position: absolute;
            top: 50%;
            margin-top: 90px;
        }
        .disnone{
            display: none;
        }
        #resultPage2{
            overflow: scroll;
            height: 100%;
            width: 100%;
            overflow-scrolling: touch;
            -webkit-overflow-scrolling : touch;
        }
        #startBack{
            background:url("./img/start/1a.jpg") no-repeat bottom center;
            background-size:100% auto;
        }

        /*  #startBtn{
              background-color: red;
          }*/
        #resultPage2 {
            overflow: scroll
        }
        #resultPage2Back{
            position: relative !important;
            height:auto !important;
            width:100%;
            vertical-align: top;
        }
        #swiper-container{
            width: 100%;
            height: 100% !important;
            overflow: hidden;
        }
 /*start页面时间改变*/
        #month,#counter{
        
              font-size: 18px;
              display: inline-block;
              color:#dfbf79;
              background: rgba(33, 33, 33, 0);
              font-family: Courier;
              border-radius: 2px;
              background: #6c2b8d;
            border:1px solid #dfbf79;
            text-align: center;
            line-height: 100%;
                   padding:2px;
        }
        #counter{
            -webkit-animation-duration: 2s ;
            animation-duration: 2s;
        }
    
        .more{
            width: 70%;
            height: 60px;
            margin: 0 auto;
            margin-top: -90px;
            z-index: 999;
            position: relative;
        }
        #swiper-container{
            overflow: hidden;
        }

    </style>


</head>

<body onload="load()" bgcolor="#ffffff">
<script type="text/javascript">
  // var choujiangResult = 0;
  var ua = navigator.userAgent.toLowerCase();//获取判断用的对象
  window.dschannel = '';
  if (ua.match(/MicroMessenger/i) == "micromessenger") {
      //在微信中打开
      window.dschannel = "weixin";
  }

	if(0){//if(Tida.isSupportedApp){//淘系
	  Tida.ready({
	    debug:0,
	    combo:0,
	    module:["device", "media", "server", "social", "widget", "sensor", "share","buy","draw","im","calendar","prize"]
	  }, function(){

	    var options = {
	      sellerNick: ""
	    };

	    Tida.mixNick(options, function (data) {
	    	gameStart();
	    });

	  });
	}else if(window.dschannel=='weixin'){//微信
	  	$.ajax({
			url:"/interface/wechat/signature/get",
			type:"POST",
			dataType:"json",
			data:{url:encodeURIComponent(location.href)},
			success:function(result){
				console.log(result);
				// alert(JSON.stringify(result.data));
				wxConfig(result.data);
			},
			error:function(){

			}
		});
		/*$(document).ready(function(){
			var openid = $('input[name=m0j1t2]').val()||'';
			if(openid==''){
				var url = 'https://vrbuy.ews.m.jaeapp.com/lux/index';
				var oauthurl = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx6d5c659db53fee95&redirect_uri='+url+'&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect';
				location.href = oauthurl;
			}
		});*/

		gameStart();
	}else if(0){
		$(document).ready(function(){
          $('body').html('请用手淘或者微信打开');
        });
	}else{
        $('body').append('<input type="hidden" name="m0j1t2" value="asdfasdfsdg"/>');
        $('body').append('<input type="hidden" name="m0j1t2Avatar" value="https://assets.alicdn.com/app/sns/img/default/avatar-120.png"/>');
		$('body').append('<input type="hidden" name="m0j1t2Nickname" value="gdfgdfg"/>');
		gameStart();
	}

	//获取奖品
	function getAward(aa){
        if (aa == 0) {
            $("#choujiangPic").attr('src', "./img/result/nprize.png");
            $('#close1').hide(true);
            $('#close2').show(true);
            $('#continue1').hide(true);
            $('#continue2').show(true);
            $('#choujiangInput1').hide(true);
            $('#choujiangInput2').hide(true);
            $('#choujiangInput3').hide(true);
        } else {
            $("#choujiangPic").attr('src', "./img/result/prize.png");
            $('#close1').show(true);
            $('#close2').hide(true);
            $('#continue1').show(true);
            $('#continue2').hide(true);

            $('#choujiangInput1').show(true);
            $('#choujiangInput2').show(true);
            $('#choujiangInput3').show(true);
        }
        $('#choujiangPage').show(true);

	}
    var mySwiper;
	function gameStart(){

        $(document).ready(function(){
/*            $('#resultPage2Back').on('swipeDown',function(event){
                // alert(1);
                // alert($('#resultPage2').scrollTop());
                // alert(1);
                if($('#resultPage2').scrollTop()<=300){
                    alert(2);
                    mySwiper.slidePrev();
                }
                // event.preventDefault();
            });*/
            // alert(1);
            var aa = $('#resultPage2').scrollTop();
            $('#resultPage2').on('scroll',function(){
                if($('#resultPage2').scrollTop()<=10&&$('#resultPage2').scrollTop()<=aa){
                    mySwiper.slidePrev();
                }
                aa = $('#resultPage2').scrollTop();
            });

            var openid = $('input[name=m0j1t2]').val()||'';
            if(0&&window.dschannel=='weixin'&&openid==''){
                var url = 'https://vrbuy.ews.m.jaeapp.com/lux/index';
                var oauthurl = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx6d5c659db53fee95&redirect_uri='+url+'&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect';
                // var oauthurl = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx6d5c659db53fee95&redirect_uri='+url+'&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect';
                location.href = oauthurl;
                return;
            }

			$('#dropdown3').on('click',function(){
                //getAward(1);
                //return;
				if(window.chance<=0){
					alert('你抽过了');
					return;
				}
				// alert('开始抽奖');
				window.chance = 0;
				window.interface.lottery(function(award){
					console.log(award);
					if(award==1){
						// alert('中奖了');
						getAward(1);
					}else{
						// alert('没中奖');
						getAward(0);
					}
				});
			});
            //查看更多
            $('.more').on('click',function(){
                window.location.href="https://luxgf.m.tmall.com"
            })

            //表单提交
			$('#continue1').on('click',function(){
				var realname = $('#choujiangInput1').val();//'aaa'+Math.floor(Math.random()*1000);
				var phone = $('#choujiangInput2').val();//'bbb'+Math.floor(Math.random()*1000);
				var address = $('#choujiangInput3').val();//'ccc'+Math.floor(Math.random()*1000);
                if(realname==''||phone==''||address==''){
                    alert('请填写完整的信息！');
                    return;
                }
				// alert('realname:'+realname+',phone:'+phone+',address:'+address);
				window.interface.submitInfo({realname:realname,phone:phone,address:address},function(result){
					if(result){
						alert('提交成功');
                        $('#choujiangPage').hide(true);
                    }else{
                        alert('提交失败');
                        $('#choujiangPage').hide(true);
					}
				});
			});
			//收藏
			$('.follow').click(function () {
                //收藏店铺测试
                Tida.social({
                    sellerId: '2096774167', // 商家的userid
                    action: "follow"
                }, function (e) {
                    if (e.errorCode == 0) {
                        alert('收藏成功!');
                    }
                });
            });


            window.interface.login(function(chance,avatar,name){
                // console.log(chance);
                window.chance = chance;
                // console.log(avatar);
                // console.log(name);
                // console.log($('#avatar-box'));
                $('#avatar-box').css('backgroundImage','url("'+avatar+'")');
                $('#username').html(name);
                // alert('登录成功');
            });
		});		
	}

	function wxConfig(data){
	  wx.config({
	      //debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
	      appId: 'wx6d5c659db53fee95', // 必填，公众号的唯一标识
	      timestamp: data.timestamp, // 必填，生成签名的时间戳
	      nonceStr: data.nonceStr, // 必填，生成签名的随机串
	      signature: data.signature,// 必填，签名，见附录1
	      jsApiList: ['onMenuShareTimeline',
	        'onMenuShareAppMessage',
	        'onMenuShareQQ',
	        'onMenuShareWeibo',
	        'onMenuShareQZone',
	        'hideMenuItems',
	        'showMenuItems'
	      ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
	  });
	  wx.ready(function(){
	    // alert("wxReady");
	    console.log("wxReady");
	      // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
	    // var iteamid = getQueryStringByName('id');
	    var url = location.href;
	    var shareData={
	        title: '解锁你的香氛图谱，赢杨颖复出直播门票', // 分享标题
	        desc: '解锁你的香氛图谱，赢杨颖复出直播门票', // 分享描述
	        link: url, // 分享链接
	        imgUrl: 'https://vrbuy.ews.m.jaeapp.com/lux/static/images/share2.jpg', // 分享图标
	        success: function () { 
	           // 用户确认分享后执行的回调函数
	           // alert("shareSuccess");
	        },
	        cancel: function () { 
	            // 用户取消分享后执行的回调函数
	        }
	    };
	    //朋友圈
	    wx.onMenuShareTimeline(shareData);
	    //朋友
	    wx.onMenuShareAppMessage(shareData);
	    //qq
	    wx.onMenuShareQQ(shareData);
	    //腾讯微博
	    wx.onMenuShareWeibo(shareData);
	    //qq空间
	    wx.onMenuShareQZone(shareData);
	  });
	}	
</script>
<img class="disnone" src="./img/loading/container.png" alt="">
<img class="disnone" src="./img/loading/pfill.png" alt="">
<div id="loading">
    <div class="wrap">
        <div class="load-contain">
        </div>
        <div class="load-fill"></div>
    </div>
    <div class="progress">0%</div>
</div>
<div id="startPage" style="display:none">
    <div id="startBack" ></div>
    <div id="month"><span>4</span></div>
    <div id="counter" class="animated infinite zoomIn">
            21
    </div>
    <div id="startBtn"></div>
	
</div>


    <div id="testPage" style="display:none">
        <img id="testBack" src="./img/test1/testback.jpg"></img>
        <img id="testBack1" src="./img/test1/testback1.png"></img>
        <img id="testTitle1" src="./img/test1/title1.png"></img>
        <input id="nextBtn" type="image" src="./img/test1/next.png" />
        <input id="resultBtn" type="image" src="./img/test5/makecard.png" />

        <input id="choiceBtn1" type="image" src="./img/test1/choice1.png" />
        <input id="choiceBtn2" type="image" src="./img/test1/choice2.png" />
        <input id="choiceBtn3" type="image" src="./img/test1/choice3.png" />
        <input id="choiceBtn4" type="image" src="./img/test1/choice4.png" />

        <img id="selectImg" src="./img/test1/selected.png"></img>

    </div>


    <div id="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide">
                <!--<img src="./img/start/logo.png" width="100%" height="50%"></img>-->
                <div id="resultPage" style="display:none">
                    <div id="avatar-box"></div>
                    <img id="resultBack" src="./img/result/result1.jpg"></img>
                    <img id="resultBack1" src="./img/result/resultback.png"></img>
                    <p id="username" align="center" style="color:black;font-size:12px;">honghui5408</p>
                    <p id="resultText" align="center" style="color:#792ea7;font-size:20px;"></p>
                    <div id="resultInfo1">
                        <font id="resultCent1" style="color:#fdae44;font-size:14px;">11%</font>
                        <font id="result1" style="color:black;font-size:12px;">温润甜橙香</font>
                    </div>
                    <div id="resultInfo2">
                        <font id="resultCent2" style="color:#f85674;font-size:14px;">17%</font>
                        <font id="result2" style="color:black;font-size:12px;">少御钟情红玫瑰</font>
                    </div>
                    <div id="resultInfo3">
                        <font id="resultCent3" style="color:#792ea7;font-size:14px;">71%</font>
                        <font id="result3" style="color:black;font-size:12px;">仲夏微馨薰衣草</font>
                    </div>
                    <div id="resultContent">
                        <font style="color:black;font-size:13px;">你踮起脚尖，轻旋曼转。优雅又兼具质感的仲夏梦香，最能点亮你清丽脱俗的惊艳。</font>
                    </div>

                <input id="dropdown1" type="image" src="./img/result/touming.png"/>
                <input id="dropdown2" class="follow" type="image" src="./img/result/touming.png"/>
                <input id="dropdown3" type="image" src="./img/result/touming.png"/>
            </div>
        </div>
        <div id="resultPage2" class="swiper-slide">
            <img class='swiper-no-swiping' id="resultPage2Back" src="./img/result/data.jpg"/>
            <div class='more'></div>
        </div>
    </div>
</div>


    <div id="choujiangPage" style="display:none">
        <img id="choujiangPic" src="./img/result/prize.png"></img>
        <input id="close1" type="image" src="./img/result/touming.png" />
        <input id="close2" type="image" src="./img/result/touming.png" />

        <input id="continue1" type="image" src="./img/result/touming.png" />
        <input id="continue2" type="image" src="./img/result/touming.png" />

        <!--<input style="border:0;" type="text" id="choujiangInput1"></input>-->
        <input style="border:0; background-color: transparent;padding-top:5px;" type="text" id="choujiangInput1"></input>
        <input style="border:0; background-color: transparent;padding-top:5px;" type="text" id="choujiangInput2"></input>
        <input style="border:0; background-color: transparent;padding-top:5px;" type="text" id="choujiangInput3"></input>
    </div>


<script type="text/javascript">
    new resLoader({
        resourceType: 'image', //资源类型，默认为图片
        baseUrl: './img/', //基准url
        resources: ['loading/pfill.png', 'start/1a.jpg', 'test1/choice1.png', 'test1/choice2.png', 'test1/choice3.png', 'test1/choice4.png', 'test1/title1.png', 'test1/next.png', 'test1/selected.png',  'test1/testback.jpg', 'test1/testback1.png','test2/choice1.png', 'test2/choice2.png', 'test2/choice3.png', 'test2/choice4.png', 'test2/title2.png', 'test3/choice1.png', 'test3/choice2.png', 'test3/choice3.png', 'test3/choice4.png', 'test3/title3.png', 'test4/choice1.png', 'test4/choice2.png', 'test4/choice3.png', 'test4/choice4.png', 'test4/title4.png', 'test5/choice1.png', 'test5/choice2.png', 'test5/choice3.png', 'test5/choice4.png', 'test5/title5.png', 'test5/makecard.png','result/data.jpg',  'result/data.jpg', 'result/result1.jpg', 'result/result2.jpg', 'result/result3.jpg', 'result/result4.jpg'], //资源路径数组
        onStart: function () {
            $('#loading').show();
//                alert('开始加载');
            console.log(1);
        }, //加载开始回调函数，传入参数total
        onProgress: function (currentIndex, total) {
            var count = Math.floor(currentIndex / total * 100);
            $('.progress').html(count + '%');
            $('.load-fill').css('margin-top', 50 - currentIndex / total * 130 + 'px')

        }, //正在加载回调函数，传入参数currentIndex, total
        onComplete: function () {
            $('.progress').html('100%');
            setTimeout(function () {
                $('#loading').hide();
            }, 300)

        }//加载完毕回调函数，传入参数total
    }).start();

    document.addEventListener('touchstart', function (event) {
        //event.preventDefault();
    }, false);

        window.addEventListener('load', function() {
            FastClick.attach(document.body);
        }, false);

        var SCREEN_WIDTH = document.documentElement.clientWidth;
        var SCREEN_HEIGHT = document.documentElement.clientHeight;
        var BEI_SHU = 0.6;
        var testStep = 1;

        var resultType = 1;

        var testIndex1 = 0;
        var testIndex2 = 0;
        var testIndex3 = 0;
        var testIndex4 = 0;
        var testIndex5 = 0;

        choujiangResult = 0;

        function controlPosSet(control, left, top, width, height, zIndex) {
            control.style.position = "absolute";
            control.style.left = left + 'px';
            control.style.top = top + 'px';
            control.style.width = width + 'px';
            control.style.height = height + 'px';
            control.style.zIndex = zIndex;
        }

    function controlPosSet2(control, left, top, width, height, zIndex) {
        control.style.position = "relative";
        control.style.left = left + 'px';
        control.style.top = top + 'px';
        control.style.width = width + 'px';
        control.style.height = height + 'px';
        control.style.zIndex = zIndex;
    }
 function controlPosSet3(control, left, bottom, width, height, zIndex) {
        control.style.position = "absolute";
        control.style.left = left + 'px';
        control.style.bottom = bottom + 'px';
        control.style.width = width + 'px';
        control.style.height = height + 'px';
        control.style.zIndex = zIndex;
    }
    window.onresize = function () {
        //load();
    };

        function load() {
            //$("body").hide();


            initStart();

            initTest();

            document.getElementById("startPage").style.display = "inline";
            document.getElementById("testPage").style.display = "inline";

            $('#testPage').hide(true);

            document.getElementById("resultPage").style.display = "inline";

            initResult();



            $(".swiper-wrapper").height(SCREEN_HEIGHT + 'px');

        mySwiper = new Swiper('#swiper-container', {
            direction: 'vertical',
            preventLinksPropagation : true,
    
            slideToClickedSlide:true,
            touchMoveStopPropagation : false,
        });

            $('#swiper-container').hide(true);
            var container = document.getElementById("swiper-container");
            controlPosSet(container, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 0);

            initChouJiang();
            document.getElementById("choujiangPage").style.display = "inline";
            $('#choujiangPage').hide(true);
        }

        function initTest() {
            var testBack = document.getElementById("testBack");
            var testBack1 = document.getElementById("testBack1");
            var testTitle1 = document.getElementById("testTitle1");

            var nextBtn = document.getElementById("nextBtn");
            var resultBtn = document.getElementById("resultBtn");
            var choiceBtn1 = document.getElementById("choiceBtn1");
            var choiceBtn2 = document.getElementById("choiceBtn2");
            var choiceBtn3 = document.getElementById("choiceBtn3");
            var choiceBtn4 = document.getElementById("choiceBtn4");

            var selectImg = document.getElementById("selectImg");

            controlPosSet(testBack, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, -1);
            controlPosSet(testBack1, 10, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 20) * 1.393 * 0.5, (SCREEN_WIDTH - 20), (SCREEN_WIDTH - 20) * 1.393, 0);
            controlPosSet(nextBtn, SCREEN_WIDTH / 2 - 347 * BEI_SHU * 0.5 * (SCREEN_WIDTH / 375), SCREEN_HEIGHT / 2 + (SCREEN_WIDTH - 20) * 1.393 * 0.5 - 10, 347 * BEI_SHU * (SCREEN_WIDTH / 375), 70 * BEI_SHU * (SCREEN_HEIGHT / 667), 0);
            controlPosSet(testTitle1, SCREEN_WIDTH / 2 - (SCREEN_WIDTH - 20) * 0.4, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 20) * 1.393 * 0.5 - (SCREEN_WIDTH - 20) * 0.8 * 0.394 * 0.2, (SCREEN_WIDTH - 20) * 0.8, (SCREEN_WIDTH - 20) * 0.8 * 0.394, 0);
            controlPosSet(resultBtn, SCREEN_WIDTH / 2 - 347 * BEI_SHU * 0.5 * (SCREEN_WIDTH / 375), SCREEN_HEIGHT / 2 + (SCREEN_WIDTH - 20) * 1.393 * 0.5 - 10, 347 * BEI_SHU * (SCREEN_WIDTH / 375), 70 * BEI_SHU * (SCREEN_HEIGHT / 667), 0);

            controlPosSet(choiceBtn1, 40, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 0);
            controlPosSet(choiceBtn2, SCREEN_WIDTH / 2 + 20, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 0);
            controlPosSet(choiceBtn3, 40, SCREEN_HEIGHT / 2 + 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 0);
            controlPosSet(choiceBtn4, SCREEN_WIDTH / 2 + 20, SCREEN_HEIGHT / 2 + 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 0);

            controlPosSet(selectImg, 40, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);

            $('#selectImg').hide(true);

            $('#resultBtn').hide(true);

        $('#nextBtn').on('click', function (event) {
            if ((testStep == 1 && testIndex1 < 1) || (testStep == 2 && testIndex2 < 1) || (testStep == 3 && testIndex3 < 1) || (testStep == 4 && testIndex4 < 1)) {
                alert('请选择答案');
                return;
            }
            var selectImg = document.getElementById("selectImg");
            testStep++;
            if (testStep == 2) {
                $("#testTitle1").attr('src', "./img/test2/title2.png");

                    $("#choiceBtn1").attr('src', "./img/test2/choice1.png");
                    $("#choiceBtn2").attr('src', "./img/test2/choice2.png");
                    $("#choiceBtn3").attr('src', "./img/test2/choice3.png");
                    $("#choiceBtn4").attr('src', "./img/test2/choice4.png");

                    controlPosSet(selectImg, 40, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);
                } else if (testStep == 3) {
                    $("#testTitle1").attr('src', "./img/test3/title3.png");

                    $("#choiceBtn1").attr('src', "./img/test3/choice1.png");
                    $("#choiceBtn2").attr('src', "./img/test3/choice2.png");
                    $("#choiceBtn3").attr('src', "./img/test3/choice3.png");
                    $("#choiceBtn4").attr('src', "./img/test3/choice4.png");

                    controlPosSet(selectImg, 40, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);
                } else if (testStep == 4) {
                    $("#testTitle1").attr('src', "./img/test4/title4.png");

                    $("#choiceBtn1").attr('src', "./img/test4/choice1.png");
                    $("#choiceBtn2").attr('src', "./img/test4/choice2.png");
                    $("#choiceBtn3").attr('src', "./img/test4/choice3.png");
                    $("#choiceBtn4").attr('src', "./img/test4/choice4.png");
                    controlPosSet(selectImg, 40, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);
                } else if (testStep == 5) {
                    $("#testTitle1").attr('src', "./img/test5/title5.png");

                    $("#choiceBtn1").attr('src', "./img/test5/choice1.png");
                    $("#choiceBtn2").attr('src', "./img/test5/choice2.png");
                    $("#choiceBtn3").attr('src', "./img/test5/choice3.png");
                    $("#choiceBtn4").attr('src', "./img/test5/choice4.png");

                    controlPosSet(selectImg, 40, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);

                $('#nextBtn').hide(true);
                $('#resultBtn').show(true);
            }
            $('#selectImg').hide(true);
            console.log('nextbtn');
        });

        $('#resultBtn').on('click', function (event) {
              if ((testStep == 5 && testIndex5 < 1)) {
                alert('请选择答案');
                return;
            }

                $('#testPage').hide(true);
                $('#startPage').hide(true);
                $('#swiper-container').show(true);

                var tmpIndex = 0;

                var count1 = 0;
                var count2 = 0;
                var count3 = 0;
                var count4 = 0;

                if (testIndex1 == 1) {
                    count1++;
                } else if (testIndex1 == 2) {
                    count2++;
                } else if (testIndex1 == 3) {
                    count3++;
                } else if (testIndex1 == 4) {
                    count4++;
                }

                if (testIndex2 == 1) {
                    count1++;
                } else if (testIndex2 == 2) {
                    count2++;
                } else if (testIndex2 == 3) {
                    count3++;
                } else if (testIndex2 == 4) {
                    count4++;
                }

                if (testIndex3 == 1) {
                    count1++;
                } else if (testIndex3 == 2) {
                    count2++;
                } else if (testIndex3 == 3) {
                    count3++;
                } else if (testIndex3 == 4) {
                    count4++;
                }

                if (testIndex4 == 1) {
                    count1++;
                } else if (testIndex4 == 2) {
                    count2++;
                } else if (testIndex4 == 3) {
                    count3++;
                } else if (testIndex4 == 4) {
                    count4++;
                }

                if (testIndex5 == 1) {
                    count1++;
                } else if (testIndex5 == 2) {
                    count2++;
                } else if (testIndex5 == 3) {
                    count3++;
                } else if (testIndex5 == 4) {
                    count4++;
                }

                tmpIndex = count1;
                if (tmpIndex == count2 && Math.random() > 0.5) {
                    tmpIndex = count2;
                    resultType = 2;
                } else if (tmpIndex < count2) {
                    tmpIndex = count2;
                    resultType = 2;
                }

                if (tmpIndex == count3 && Math.random() > 0.5) {
                    tmpIndex = count3;
                    resultType = 3;
                } else if (tmpIndex < count3) {
                    tmpIndex = count3;
                    resultType = 3;
                }
                if (tmpIndex == count4 && Math.random() > 0.5) {
                    tmpIndex = count4;
                    resultType = 4;
                } else if (tmpIndex < count4) {
                    tmpIndex = count4;
                    resultType = 4;
                }

                if (resultType == 1) {
                    $("#resultBack").attr('src', "./img/result/result1.jpg");

                    $('#resultText').text("仲夏梦香系");

                    $("#resultText").css("color", "#8533af");


                $('#result1 ').text("温润甜橙香");
                $('#result2').text("少御钟情红玫瑰");
                $('#result3').text("仲夏微馨薰衣草");

                    var random3 = Math.floor(Math.random() * 100 * 0.2) + 50;
                    var random1 = Math.floor(Math.random() * 100 * 0.05) + 25;
                    var random2 = 100 - random1 - random3;
                    $('#resultCent1').text(random1 + '%');
                    $('#resultCent2').text(random2 + '%');
                    $('#resultCent3').text(random3 + '%');

                } else if (resultType == 2) {
                    $("#resultBack").attr('src', "./img/result/result2.jpg");

                    $('#resultText').text("乖甜俏香系");
                    $("#resultText").css("color", "#ec5e8f");

                    $('#result1').text("梦幻少女甜樱");
                    $('#result2').text("温润甜橙香");
                    $('#result3').text("清新沁爽香柠檬");

                    var random1 = Math.floor(Math.random() * 100 * 0.2) + 50;
                    var random2 = Math.floor(Math.random() * 100 * 0.05) + 25;
                    var random3 = 100 - random1 - random2;
                    $('#resultCent1').text(random1 + '%');
                    $('#resultCent2').text(random2 + '%');
                    $('#resultCent3').text(random3 + '%');

                } else if (resultType == 3) {
                    $("#resultBack").attr('src', "./img/result/result3.jpg");

                    $('#resultText').text("空灵薄香系");
                    $("#resultText").css("color", "#407f1d");

                    $('#result1').text("淡雅风情茉莉香");
                    $('#result2').text("特立独香小苍兰");
                    $('#result3').text("沉静悠扬木檀香");

                    var random1 = Math.floor(Math.random() * 100 * 0.2) + 50;
                    var random2 = Math.floor(Math.random() * 100 * 0.05) + 25;
                    var random3 = 100 - random1 - random2;
                    $('#resultCent1').text(random1 + '%');
                    $('#resultCent2').text(random2 + '%');
                    $('#resultCent3').text(random3 + '%');

                } else if (resultType == 4) {
                    $("#resultBack").attr('src', "./img/result/result4.jpg");

                    $('#resultText').text("醇黑暗香系");
                    $("#resultText").css("color", "#1679a0");

                    $('#result1').text("馥郁黑晚香玉");
                    $('#result2').text("含笑乱步迷迭香");
                    $('#result3').text("神秘魅惑幽兰");

                    var random1 = Math.floor(Math.random() * 100 * 0.2) + 50;
                    var random2 = Math.floor(Math.random() * 100 * 0.05) + 25;
                    var random3 = 100 - random1 - random2;
                    $('#resultCent1').text(random1 + '%');
                    $('#resultCent2').text(random2 + '%');
                    $('#resultCent3').text(random3 + '%');
                }


        });

        $('#choiceBtn1').on('click', function (event) {
            var selectImg = document.getElementById("selectImg");
            $('#selectImg').show(true);
            if (testStep == 1) {
                testIndex1 = 1;
            } else if (testStep == 2) {
                testIndex2 = 1;
            } else if (testStep == 3) {
                testIndex3 = 1;
            } else if (testStep == 4) {
                testIndex4 = 1;
            } else if (testStep == 5) {
                testIndex5 = 1;
            }
            controlPosSet(selectImg, 40, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);
        });

        $('#choiceBtn2').on('click', function (event) {
            $('#selectImg').show(true);
            var selectImg = document.getElementById("selectImg");
            if (testStep == 1) {
                testIndex1 = 2;
            } else if (testStep == 2) {
                testIndex2 = 2;
            } else if (testStep == 3) {
                testIndex3 = 2;
            } else if (testStep == 4) {
                testIndex4 = 2;
            } else if (testStep == 5) {
                testIndex5 = 2;
            }

            controlPosSet(selectImg, SCREEN_WIDTH / 2 + 20, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 120) * 0.5 * 1.143 - 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);
        });

        $('#choiceBtn3').on('click', function (event) {
            $('#selectImg').show(true);
            var selectImg = document.getElementById("selectImg");

                if (testStep == 1) {
                    testIndex1 = 3;
                } else if (testStep == 2) {
                    testIndex2 = 3;
                } else if (testStep == 3) {
                    testIndex3 = 3;
                } else if (testStep == 4) {
                    testIndex4 = 3;
                } else if (testStep == 5) {
                    testIndex5 = 3;
                }

            controlPosSet(selectImg, 40, SCREEN_HEIGHT / 2 + 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);
        });

        $('#choiceBtn4').on('click', function (event) {
            $('#selectImg').show(true);
            var selectImg = document.getElementById("selectImg");

                if (testStep == 1) {
                    testIndex1 = 4;
                } else if (testStep == 2) {
                    testIndex2 = 4;
                } else if (testStep == 3) {
                    testIndex3 = 4;
                } else if (testStep == 4) {
                    testIndex4 = 4;
                } else if (testStep == 5) {
                    testIndex5 = 4;
                }

            controlPosSet(selectImg, SCREEN_WIDTH / 2 + 20, SCREEN_HEIGHT / 2 + 10 + 20, (SCREEN_WIDTH - 120) / 2, (SCREEN_WIDTH - 120) * 0.5 * 1.143, 1);
        });

        }

        function initResult() {
            var resultBack = document.getElementById("resultBack");
            var resultBack1 = document.getElementById("resultBack1");
            var username = document.getElementById("username");
            var resultText = document.getElementById("resultText");
            var resultInfo1 = document.getElementById("resultInfo1");
            var resultInfo2 = document.getElementById("resultInfo2");
            var resultInfo3 = document.getElementById("resultInfo3");
            var resultContent = document.getElementById("resultContent");
            var avatarBox= document.getElementById('avatar-box');

            var dropdown1 = document.getElementById("dropdown1");
            var dropdown2 = document.getElementById("dropdown2");
            var dropdown3 = document.getElementById("dropdown3");

            var resultPage = document.getElementById("resultPage");


            // var resultPage1 = document.getElementById("resultPage1");
            // var resultPage1Back = document.getElementById("resultPage1Back");

            // controlPosSet(resultPage1, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 0);
            // controlPosSet(resultPage1Back, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 3);

            var resultPage2 = document.getElementById("resultPage2");
            var resultPage2Back = document.getElementById("resultPage2Back");

            //controlPosSet2(resultPage2, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 0);
            controlPosSet(resultPage2Back, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 2);

            //$("#resultPage2Back").hide(true);



            //controlPosSet2(resultPage, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, -2);
            controlPosSet(resultBack, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, -1);

            $("#resultBack1").hide(true);
            $("#resultContent").hide(true);
            //新增头像
            controlPosSet(avatarBox, SCREEN_WIDTH / 2 - SCREEN_WIDTH * 63 / 750, SCREEN_HEIGHT / 2 - SCREEN_HEIGHT * 1.368 * 240 / 1205, 54, 54, 0);

            controlPosSet(resultBack1, 20, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 40) * 1.368 * 0.54, (SCREEN_WIDTH - 40), (SCREEN_WIDTH - 40) * 1.368, 0);
            controlPosSet(username, 20, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 40) * 1.368 * 0.23, (SCREEN_WIDTH - 40), 30, 0);
            controlPosSet(resultText, 20, SCREEN_HEIGHT / 2 - (SCREEN_WIDTH - 40) * 1.368 * 0.25 + 26, (SCREEN_WIDTH - 40), 30, 0);
            controlPosSet(resultInfo1, SCREEN_WIDTH / 2 - 25, SCREEN_HEIGHT / 2 - 5 - 15 - 12, SCREEN_WIDTH / 2, 20, 0);
            controlPosSet(resultInfo2, SCREEN_WIDTH / 2 - 25, SCREEN_HEIGHT / 2 - 5 + 20 - 15 - 12, SCREEN_WIDTH / 2, 20, 0);
            controlPosSet(resultInfo3, SCREEN_WIDTH / 2 - 25, SCREEN_HEIGHT / 2 - 5 + 40 - 15 - 12, SCREEN_WIDTH / 2, 20, 0);

            controlPosSet(resultContent, 55 + 3, SCREEN_HEIGHT / 2 + (SCREEN_WIDTH - 110) * 1.368 * 0.23, (SCREEN_WIDTH - 110), 80, 0);

            controlPosSet(dropdown1, SCREEN_WIDTH / 2 - 233 * BEI_SHU * 0.5 * (SCREEN_WIDTH / 375), SCREEN_HEIGHT - 52 * BEI_SHU * (SCREEN_HEIGHT / 667) - 5, 233 * BEI_SHU * (SCREEN_WIDTH / 375), 52 * BEI_SHU * (SCREEN_HEIGHT / 667), 0);
            controlPosSet(dropdown2, SCREEN_WIDTH / 2 - 177 * BEI_SHU * 0.5 * (SCREEN_WIDTH / 375), SCREEN_HEIGHT - 52 * BEI_SHU * (SCREEN_HEIGHT / 667) - 32 * BEI_SHU * (SCREEN_HEIGHT / 667) - 22, 177 * BEI_SHU * (SCREEN_WIDTH / 375), 42 * BEI_SHU * (SCREEN_HEIGHT / 667), 0);
            controlPosSet(dropdown3, SCREEN_WIDTH / 2 - 467 * 0.5 * 0.5 * (SCREEN_WIDTH / 375), SCREEN_HEIGHT - 62 * BEI_SHU * (SCREEN_HEIGHT / 667) - 42 * BEI_SHU * (SCREEN_HEIGHT / 667) - 70 * (SCREEN_HEIGHT / 667), 467 * 0.5 * (SCREEN_WIDTH / 375), 90 * 0.5 * (SCREEN_HEIGHT / 667), 0);

            // dropdown3.addEventListener('touchend', function(event) {
            //     $('#choujiangPage').show(true);
            //     if (choujiangResult == 0) {
            //         $("#choujiangPic").attr('src', "./img/result/nprize.png");
            //         $('#close1').hide(true);
            //         $('#close2').show(true);
            //         $('#continue1').hide(true);
            //         $('#continue2').show(true);
            //     } else {
            //         $("#choujiangPic").attr('src', "./img/result/prize.png");
            //         $('#close1').show(true);
            //         $('#close2').hide(true);
            //         $('#continue1').show(true);
            //         $('#continue2').hide(true);

            //         $('#choujiangInput1').show(true);
            //         $('#choujiangInput2').show(true);
            //         $('#choujiangInput3').show(true);
            //     }

            // }, false);
        }

    function initStart() {
        var startBack = document.getElementById("startBack");
        var startBtn = document.getElementById("startBtn");
        var startPage=document.getElementById("startPage");

        var counter=document.getElementById("counter");
         var month=document.getElementById("month");
        // var flipContainer=document.getElementsByClassName("flipContainer")[0];
        controlPosSet(startPage, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 0);
        controlPosSet(startBack, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 0);

        if(SCREEN_HEIGHT<600)
        {
            controlPosSet3(counter, SCREEN_WIDTH*0.2,612*SCREEN_WIDTH/750, SCREEN_WIDTH*0.05, SCREEN_WIDTH*0.05, 2);
            controlPosSet3(month, SCREEN_WIDTH*0.13, 612*SCREEN_WIDTH/750, SCREEN_WIDTH*0.05, SCREEN_WIDTH*0.05, 2);
        }else
        {
            controlPosSet3(counter, SCREEN_WIDTH*0.2, 612*SCREEN_WIDTH/750, SCREEN_WIDTH*0.05, SCREEN_WIDTH*0.05, 2);
            controlPosSet3(month, SCREEN_WIDTH*0.13, 612*SCREEN_WIDTH/750, SCREEN_WIDTH*0.05, SCREEN_WIDTH*0.05, 2);
        }
        
        controlPosSet(startBtn, SCREEN_WIDTH / 2 - 345 * BEI_SHU * 0.5 * (SCREEN_WIDTH / 375), SCREEN_HEIGHT - 920 * SCREEN_WIDTH / 750 - 45, 345 * BEI_SHU * (SCREEN_WIDTH / 375), 90 * BEI_SHU * (SCREEN_HEIGHT / 667), 0);

        $("#startBtn").on('click', function (event) {
            $('#startPage').hide(true);
            $('#testPage').show(true);
            /*   $('#testPage').hide(true);
             $('#startPage').hide(true);
             $('#swiper-container').show(true);*/
        });
    }

        function initChouJiang() {
            var choujiangPage = document.getElementById("choujiangPage");
            var choujiangPic = document.getElementById("choujiangPic");
            var close1 = document.getElementById("close1");
            var close2 = document.getElementById("close2");
            var continue1 = document.getElementById("continue1");
            var continue2 = document.getElementById("continue2");

            var choujiangInput1 = document.getElementById("choujiangInput1");
            var choujiangInput2 = document.getElementById("choujiangInput2");
            var choujiangInput3 = document.getElementById("choujiangInput3");



            controlPosSet(choujiangPage, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 3);
            controlPosSet(choujiangPic, 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT, 4);

            controlPosSet(close1, SCREEN_WIDTH * 0.842, SCREEN_HEIGHT * 0.125, SCREEN_WIDTH * 0.0826, SCREEN_WIDTH * 0.0826, 5);
            controlPosSet(close2, SCREEN_WIDTH * 0.842, SCREEN_HEIGHT * 0.176, SCREEN_WIDTH * 0.0826, SCREEN_WIDTH * 0.0826, 5);

            controlPosSet(continue1, SCREEN_WIDTH * 0.307, SCREEN_HEIGHT * 0.67, SCREEN_WIDTH * 0.389, SCREEN_HEIGHT * 0.079, 5);
            controlPosSet(continue2, SCREEN_WIDTH * 0.307, SCREEN_HEIGHT * 0.531, SCREEN_WIDTH * 0.389, SCREEN_HEIGHT * 0.067, 5);

            controlPosSet(choujiangInput1, SCREEN_WIDTH * 0.384, SCREEN_HEIGHT * 0.45, SCREEN_WIDTH * 0.341, SCREEN_HEIGHT * 0.049, 5);
            controlPosSet(choujiangInput2, SCREEN_WIDTH * 0.384, SCREEN_HEIGHT * 0.518, SCREEN_WIDTH * 0.341, SCREEN_HEIGHT * 0.049, 5);
            controlPosSet(choujiangInput3, SCREEN_WIDTH * 0.447, SCREEN_HEIGHT * 0.588, SCREEN_WIDTH * 0.281, SCREEN_HEIGHT * 0.049, 5);

        $("#close1").on('click', function (event) {
            $('#choujiangPage').hide(true);
        });

        $("#close2").on('click', function (event) {
            $('#choujiangPage').hide(true);
        });

        $("#continue1").on('click', function (event) {
            $('#choujiangPage').hide(true);
        });

        $("#continue2").on('click', function (event) {
            window.location.href = 'https://fans.m.tmall.com';
            // $('#choujiangPage').hide(true);
        });

    }
    $('#resultPage2Back').mousedown(function (e) {
        /* var scrollH=$('.resultPage2Back').scrollHeight;
         console.log(scrollH);*/
        alert(1);
        e.stopPropagation();
    })


</script>

</body>

</html>